﻿@Styles.Render("~/Content/dhtmlxTree/css")
@Scripts.Render("~/Content/dhtmlxTree/js")

<style>
    /*树节点样式*/
    .standartTreeRow {
        padding-left: 0px !important;
        white-space: nowrap;
        overflow: hidden;
        width: 165px !important;
        text-overflow: ellipsis;
    }

    .selectedTreeRow {
        display: inline !important;
    }
</style>
<script>
    var myTree;
    function loadTree() {
        myTree = dhtmlXTreeFromHTML("treeboxbox_tree"); // 加载检索树
        myTree.enableThreeStateCheckboxes(true);
        myTree.attachEvent("onClick", function (id) {
            searchSingle(id); //选择事件
        });
        myTree.attachEvent("onOpenEnd", function (nodeId, event, e) {
            if (event != -1) {
                treeClick(nodeId, e);
            }
        });
    }
    function treeClick(id, e) {
        var select = $('#categoryType').val();
        var dbName = $('#dbName').val();
        var DBid = $('#dbID').val();
        myTree.deleteChildItems(id);//加载之前先删除他的页子结点
        var checkstr = "";
        if (myTree.isItemChecked(id)) {
            checkstr = "CHECKED";
        }
        var actionurl = "@Html.Raw(Url.Action("GetCategroyChilds", "SingleSearch"))";
        var url = actionurl + "?code=" + id + "&type=" + select + "&dbName=" + dbName + "&id=" + DBid;//发送AJAX的URL
        ajaxRequestCount++;
        $.getJSON(
          url,
          function (data) {
              ajaxRequestCount--;
              $.each(data, function (index, entry) {//ajax回调后,类似于for循环.

                  myTree.insertNewChild(id, entry['Code'], entry['Name'], '', '', '', '', checkstr, '');//使用这个函数.
                  if (entry['ChildFlag'] == 1) {
                      myTree.insertNewChild(entry['Code'], entry['Code'] + '1', '', '', '', '', '', checkstr, '');//如果该节点下有子节点，添加空节点占位符
                      myTree.closeItem(entry['Code']);
                  }
                  if (e[0] == entry['Code']) {
                      if (e.length > 1) {
                          treeClick(e[0], e.splice(0, 1))
                      }
                      else {
                          myTree.setCheck(e[0], true);
                      }
                  }
              });

              var autoLoad = $("#AutoLoad").val();
              if (autoLoad == "True" && ajaxRequestCount == 0) {
                  search();
              }
          }

         );

    }

    $(document).ready(function () {
        loadTree();
        
        var categoryNodeCode = $('#CategoryNodeCode').val();
        if (categoryNodeCode != "") {
            var nodeList = categoryNodeCode.split('|');
            for (var i = 0; i < nodeList.length; i++) {
                checkSelected(nodeList[i]);
            }
        }

        var autoLoad = $("#AutoLoad").val();
        if (autoLoad == "True" && ajaxRequestCount == 0) {
            search();
        }
        //checkAll();
    });

    function checkSelected(selectNode) {
        var arrayNodes = myTree.getAllUnchecked();
        if (arrayNodes != "") {
            arrayNodes = arrayNodes.split(',');
            selectNode = selectNode.split(',');
            if (selectNode.length == 1) {
                if ($.inArray(selectNode[0], arrayNodes) != -1) {
                    myTree.setCheck(selectNode[0], true);
                }
            }
            else {
                if ($.inArray(selectNode[0], arrayNodes) != -1) {
                    var currentNode = selectNode[0];
                    selectNode.splice(0, 1)
                    treeClick(currentNode, selectNode);
                }
            }
        }
        //--选中
    }

    function checkAll() {
        var arrayNodes = myTree.getAllUnchecked();
        if (arrayNodes != "") {
            arrayNodes = arrayNodes.split(',');

            for (var i = 0; i < arrayNodes.length; i++) {
                if (arrayNodes[i] != "0") { //虚拟根节点0不能选中
                    myTree.setCheck(arrayNodes[i], true);
                }
            }

        }
        //--选中
    }
    function unCheckAll() {
        var arrayNodes = myTree.getAllChecked();
        if (arrayNodes != "") {
            arrayNodes = arrayNodes.split(',');

            for (var i = 0; i < arrayNodes.length; i++) {
                myTree.setCheck(arrayNodes[i], false);
            }
        }
        //取消选中
    }
</script>
<div id="treeboxbox_tree" enablecheckboxes="1" enabletreeimages="0" enablemultilineitems="0" enableautotooltips="1"
     setimagepath="~/Content/dhtmlxTree/codebase/imgs/dhxtree_skyblue/">
    <ul>
        @{
            if (ViewBag.CategoryList != null)
            {
                foreach (var item in ViewBag.CategoryList)
                {
                    @Html.Raw("<li  id=" + item.Code + ">" + item.Name);
                    string newid = item.Code + "1";//“1”只是一个标识，可以用任意字符替代，但是该节点必须以其根节点的itemCode开头，代表该节点下的第一个节点

                    if (item.ChildFlag == 1)// 如果该节点下有子节点，添加占位符,因为该控件在加载时会判断节点下有无子节点，
                                            //有则显示加号，没有则不显示加号，这样就会造成初次加载根节点时不会显示加号，因此先添加占位符，显示加号，点击加号时加载下面的子节点
                    {
                        @Html.Raw("<ul><li id=" + newid + "> </ul>")
                    }
                }
            }
        }
    </ul>
</div>
